<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			*{
				margin:0;
				padding:0;
				/*目的是将div中间的空格去除*/
				font-size: 0px;
			}
			div{
				width:100px;
				height:40px;
				border:1px solid red;
				text-align: center;
				line-height: 40px;
				font-size: 12px;
				/*inline==>将块元素转化为行元素*/
				/*display: inline;*/
				/*转成行内块元素,既可以在一行显示,又可以设置宽高==>inline-block*/
				display: inline-block;
				border-right: none;
			}
			.sport{
				border-right:1px solid red;
			}
		</style>
	</head>
	<body>
		<div>首页</div>
		<div>新闻</div>
		<div>娱乐</div>
		<div class="sport">体育</div>

	
	</body>
</html>
